<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>产品概述</title>
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<link rel="stylesheet" href="/resource/css/common.css">
	<link rel="stylesheet" href="/resource/css/layui.css">
	<link rel="stylesheet" href="/resource/css/system.css">
</head>
<body>
<div id="summaryWrap" class="clearfix">
	<form class="layui-form form1" method="" action="" lay-filter="summaryVal">
		<div class="layui-form-item">
			<label lay-hide hidden="hidden" id="proId"> </label>
			<div class="custom-whole">
				<label class="layui-form-label custom-fs16 custom-width-auto selfid" data-id="">产品名称:</label>
				<div class="layui-input-inline">
					<input type="text" name="proName" readonly  class="layui-input custom-fs16 borderNone">
				</div>
			</div>
			<div class="custom-whole">
				<label class="layui-form-label custom-fs16 custom-width-auto">产品类型:</label>
				<div class="layui-input-inline">
					<input type="text" name="productCode" required  class="layui-input custom-fs16 borderNone">
				</div>
			</div>
			<div class="custom-whole">
				<label class="layui-form-label custom-fs16 custom-width-auto">创建时间:</label>
				<div class="layui-input-inline">
					<input type="DateTime" name="createTime" readonly  class="layui-input custom-fs16 borderNone">
				</div>
			</div>

			<div class="custom-whole">
				<label class="layui-form-label custom-fs16 custom-width-auto">功能点数:</label>
				<div class="layui-input-inline">
					<input type="text" name="actionNum" required   class="layui-input custom-fs16 borderNone">
				</div>
			</div>

			<div class="custom-whole">
				<label class="layui-form-label custom-fs16 custom-width-auto">网络类型：</label>
				<div class="layui-input-inline">
					<input id="date" type="text" name="networkType" required   class="layui-input custom-fs16 borderNone">
				</div>
			</div>

			<div class="custom-whole">
				<label class="layui-form-label custom-fs16 custom-width-auto">供应厂家:</label>
				<div class="layui-input-inline">
					<input type="text" name="companyCode" readonly   class="layui-input custom-fs16 borderNone">
				</div>
			</div>
			<div class="custom-whole">
				<label class="layui-form-label custom-fs16 custom-width-auto">产品描述:</label>
				<div class="layui-input-inline">
					<input type="text" name="proDescription"   class="layui-input custom-fs16 borderNone">
				</div>
			</div>
			<div class="custom-whole">
				<label class="layui-form-label custom-fs16 custom-width-auto">产品型号:</label>
				<div class="layui-input-inline input-inline-width-290">
					<input type="text" name="modelNumber" readonly   class="layui-input custom-fs16 borderNone">
				</div>
			</div>
		</div>
		<div class="layui-form-item">
			<div class="layui-input-block">
				<button type="button" class="layui-btn btnCss" id="btn-edit">编辑</button>
				<button lay-submit class="layui-btn" lay-filter="formSub" id="btn-submit">提交</button>
			</div>
		</div>
	</form>
	<div class="goods" id="product_logo">
		<img src="../resource/images/product/Starry.jpg" alt="产品图" id="img"/>
		<!--<button type="button" class="layui-btn" id="imgUpload">-->
		<!--<i class="layui-icon">&#xe67c;</i>上传图片-->
		<!--</button>-->
	</div>


	<!--
        <div>
            <form action="" method="post" id="uploadForm" enctype="multipart/form-data">
                <input type="hidden" name="picture" value="uploadpic">

                <table width="100%" border="0" cellspacing="0" cellpadding="0">
                    <tr>
                        <td bgcolor="#FFFFFF">
                            <input type="file" id="proPic" name="proPic"/>
                            <input type="button" value="上传" onclick="doUpload();">
                        </td>
                    </tr>
                </table>
            </form>
        </div>-->

</div>
<div class="eData clearfix">
	<div style="width:40%;height: 400px;" class="echartsCss main1">
		<h3 class="summaryH3">终端设备状态</h3>
		<div id="main1" style="width:100%;height: 400px;"></div>
	</div>
	<div style="width:58%;height: 400px;" class="echartsCss main2">
		<h3 class="summaryH3">终端设备趋势</h3>
		<p class="timeTab" id="tab1">
			<span id="today1" data-id="today">今日</span>
			<span id="sevenday1" data-id="sevenday">7日</span>
			<span id="threetyday1" data-id="threetyday">30日</span>
			<span id="nintyday1" data-id="nintyday">90日</span>
		</p>
		<div id="main2" style="width:100%;height: 300px;"></div>
	</div>
</div>
<div class="eData clearfix">
	<div class="echartsCss main3" style="width:40%;height: 400px;">
		<h3 class="summaryH3">用户状态</h3>
		<div id="main3" style="width:100%;height: 400px;"></div>
	</div>
	<div class="echartsCss main4" style="width:58%;height: 400px;">
		<h3 class="summaryH3">手机用户趋势</h3>
		<p class="timeTab" id="tab2">
			<span id="today2" data-id="today">今日</span>
			<span id="sevenday2" data-id="sevenday">7日</span>
			<span id="threetyday2" data-id="threetyday">30日</span>
			<span id="nintyday2" data-id="nintyday">90日</span>
		</p>
		<div id="main4" style="width:100%;height: 300px;"></div>
	</div>
</div>
<div class="eData connectOne clearfix">
	<div class="echartsCss main5" style="width:40%;">
		<h3 class="summaryH3">产品分布</h3>
		<div id="main5" style="width:100%;height: 400px;"></div>
	</div>
	<div class="echartsCss mapAll" style="width:58%;height: 400px;">
		<div id="mapAll" style="width:100%;height: 450px;"></div>
	</div>
</div>
<script src="/resource/layui.js"></script>
<script src="/resource/jquery.min.js"></script>
<script src="/resource/echarts.js"></script>
<script src="/resource/iframe.js"></script>
<script src="/resource/map/china.js"></script>
<script>
    var token=(new parent.window._user()).getData('token');

    var condition={"companyCode":(new parent.window._user()).getData('venderCode'), //厂商编号
        "productCode":(new parent.window._user()).getData('productCode'),  //产品名称编号
        "modelNumber":(new parent.window._user()).getData('versionCode'),//产品型号
        "_token":token};
    layui.use(['form','upload'], function(){
        var form = layui.form,
            upload = layui.upload,
            $ = layui.jquery,
            proId;
        $.ajax({
            url: '/product/getProduct?_token='+token,
            type: 'get',
            contentType: "application/json;charset=UTF-8",
            dataType: 'json',
            data: {"companyCode":(new parent.window._user()).getData('venderCode'), //厂商编号
                "productCode":(new parent.window._user()).getData('productCode'),  //产品名称编号
                "modelNumber":(new parent.window._user()).getData('versionCode')  //产品型号
            },
            success:function (result) {
                var pro=result.data[0];
                console.log(pro)
                // $(".selfid").attr("data-id",result.data[0].id);
                // var qw = $(".selfid").attr("data-id");
                proId = result.data[0].id;
                $("#proId").html(result.data[0].id);//给proId赋值
                // var wq = $("#proId").html();//取proId的值

                form.val("summaryVal", { //初始值
                    "proName": pro.proName // "name": "value"
                    ,"productCode": pro.product
                    ,"createTime": pro.createTime
                    ,"actionNum": pro.actionNum
                    ,"networkType": pro.networkType
                    ,"companyCode": pro.vender
                    ,"proDescription":pro.proDescription
                    ,"modelNumber":pro.version
                })
                form.render();

                var uploadInst = upload.render({
                    elem: '#product_logo' //绑定元素
                    ,method:'post'
                    ,url: '/product/uploadImage' //上传接口
                    ,accept: 'images'
                    ,size: 200
                    ,exts:"jpg|png|gif|bmp|jpeg"
                    ,field:"imgFile"
                    ,data: {"_token":token,"proId":proId}
                    ,auto: true
                    // ,bindAction: '#uploadBtn'
                    ,done: function(res){
                        layer.msg("上传头像成功！");
                        document.location.reload();
                        //上传完毕回调
                    }
                    ,error: function(){
                        //请求异常回调
                        layer.msg("上传头像失败！");
                    }
                });
                if(pro.proImg!=null){
                    document.getElementById("img").src =pro.proImg;
                }else {
                    document.getElementById("img").src = "/resource/images/product/Starry.jpg";
                }
            },
            error:function(){

            }

        })

        //监听编辑
        var $input = $(".layui-form-item input");
        document.getElementById("btn-edit").addEventListener("click",function(){

            $input.removeClass("borderNone");
            $input.removeAttr("readonly");
            $input.attr("required");
            $("#btn-edit").addClass("layui-hide")
            $("#btn-submit").removeClass("layui-hide");
        });
        //监听提交
        form.on('submit(formSub)', function(data){
            //这里可以写ajax方法提交表单
            var proid = $("#proId").html();//获取ID
            $.ajax({
                type: 'post',
                //contentType: "application/json;charset=UTF-8",//传json对象时使用JSON.stringify(data.field)
                dataType: 'json',
                data: {
                    "id":proid,
                    "proName": data.field.proName // "name": "value"
                    ,"createTimeStr": data.field.createTime
                    ,"actionNum": data.field.actionNum
                    ,"networkType": data.field.networkType
                    ,"proDescription":data.field.proDescription

                },
                url: '/product/updateProduct?_token='+token,
                success:function (result) {
                    $input.addClass("borderNone");
                    $input.removeAttr("required");
                    $input.attr("readonly","readonly");
                    $("#btn-edit").removeClass("layui-hide");
                    $("#btn-submit").addClass("layui-hide");
                    console.log(result);
                    if(result.data==1){
                        layer.msg("修改成功");
                    }
                },error:function () {
                    layer.msg("修改失败");
                }
            })


            return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
        });
    });










    //终端设备状态
    //终端设备状态

    $(function(){
        var x = 1;
        $(".timeTab").on("click","span",function(){
            x = '';
            var _this = $(this);
            var _thisParents = $(_this).parent().attr("id");
            console.log(_thisParents)
            var _id = _this.attr("data-id");
            var i;
            if(_id == 'today'){
                i = 24;
                x = 1;
            }else if(_id == "sevenday"){
                i = 7;
                x = 0;
            }else if(_id == "threetyday"){
                i = 30;
                x = 4;
            }else if(_id == "nintyday"){
                i = 90;
                x = 12;
            }
            numday(i,_thisParents,x)
        })
        function numday(i,par,x){
            var timeer=[];
            if(i == "24"){
                for(var sec = 1;sec < i + 1;sec++){
                    timeer.push(sec+"时");
                }
                i = '';

            }else{
                for(var tt=1;tt<i+1;tt++){
                    var date= new Date();
                    var newDate = new Date(date.getTime() - tt*24*60*60*1000);
                    var month = newDate.getMonth()+1;
                    month<10?month='0'+month:month;
                    var date = newDate.getDate();
                    date<10?date='0'+date:date;
                    var time = newDate.getFullYear()+"-"+(month)+"-"+date;
                    timeer.push(time);
                }

            }
            var data = i+"+"+timeer+"+"+x;
            console.log(par)
            if(par == "tab1"){

                deviceChatLine(data)
            }else if(par == "tab2"){
                userCountLine(data)
            }
        }

        getDevice();

        getUserCount();

        getDeviceCountByProvince();

        var i = 24;
        var timeer = [];
        for(var sec = 1;sec < i + 1;sec++){
            timeer.push(sec+"时");
        }

        deviceChatLine(''+"+"+timeer+"+"+x);

        userCountLine(''+"+"+timeer+"+"+x);
    })

    function getDeviceCountByProvince() {
        $.ajax({
            type:"get",
            data:condition,
            url:"/store/deviceCountByProvince",
            success:function(result){
                var optionData = result.data;
                deviceCountByProvince(optionData.all,optionData.online,optionData.provinc);
            }
        })
    }

    function getDevice(){
        $.ajax({
            type:"get",
            data:condition,
            url:"/store/deviceCount",
            success:function(result){
                var optionData = result.data;
                initEchart(optionData.deviceOut,optionData.inventory,optionData.deviceOnline,optionData.deviceOffline);
            }
        })
    }
    function initEchart(deviceOut,inventory,online,offline){
        var dom1 = document.getElementById("main1");
        var myChart1 = echarts.init(dom1);
        option = null;
        option = {
            tooltip: {
                trigger: 'item',
                formatter: "{a} <br/>{b}: {c} ({d}%)"
            },
            legend: {
                orient: 'horizontal',
                x: 'top',
                data:['已卖出','库存','离线','在线']
            },
            series: [
                {
                    name:'使用情况',
                    type:'pie',
                    selectedMode: 'single',
                    radius: [0, '30%'],

                    label: {
                        normal: {
                            position: 'inner'
                        }
                    },
                    labelLine: {
                        normal: {
                            show: false
                        }
                    },
                    data:[
                        {value:online, name:'在线'},
                        {value:offline, name:'离线'}
                    ]
                },
                {
                    name:'设备销量',
                    type:'pie',
                    radius: ['40%', '60%'],
                    data:[
                        {value:deviceOut, name:'已卖出'},
                        {value:inventory, name:'库存'}

                    ]
                }
            ]
        };
        if (option && typeof option === "object") {
			var ser = option.series;
			jQuery.each(ser,function(i,which){
				jQuery.each(which.data,function(v,val){
                    if(val.value == 0){
                        which.data[v] = {};
					}
				})
                myChart1.setOption(option, true);
			})
        }


        window.onresize = function(){
            myChart1.resize();
        }
    }

    function deviceChatLine(day){
        var dayNum = day.split("+");
        var d = dayNum[0];

        var dd = dayNum[1].split(",");
        var ax = parseInt(dayNum[2]);
        var daydate = [];
        daydate.push(dd)
        if(d !== ''){
            d = parseInt(d);
            daydate = daydate[0].reverse();
        }else{
            daydate = daydate[0]
        }
        $.ajax({
            type:"get",
            data:{
                "companyCode":(new parent.window._user()).getData('venderCode'), //厂商编号
                "productCode":(new parent.window._user()).getData('productCode'),  //产品名称编号
                "modelNumber":(new parent.window._user()).getData('versionCode'),//产品型号
                "_token":(new parent.window._user()).getData('token'),
                "day":d
            },
            url:"/store/deviceChatLine",
            success:function(result){
                var optionData = result.data;
                var outarr;
                var allarr ;
                var onlinearr;
                if(d == ''){
                    outarr = new Array(24);
                    outarr.fill(0);
                    $.each(optionData.deviceOutList,function(index, item){
                        outarr.splice(index,index+1,item.outDeviceNum);
                    });
                    console.log("已卖出设备："+ outarr);
                    allarr = new Array(24);
                    allarr.fill(0);
                    $.each(optionData.deviceAllList,function(index,item){
                        allarr.splice(index,index+1,item.allDeviceNum);
                    })
                    console.log("所有设备："+ allarr);
                    onlinearr = new Array(24);
                    onlinearr.fill(0);
                    $.each(optionData.deviceOnlineList,function(index,item){
                        onlinearr.splice(index,index+1,item.deviceOnlineCount);
                    })
                    console.log("在线设备："+ onlinearr);
                }else {
                    outarr = new Array(d);
                    outarr.fill(0)
                    for(var i = 0;i<daydate.length;i++){
                        for(var j = 0;j<optionData.deviceOutList.length;j++){
                            var objOut = optionData.deviceOutList[j];
                            if(objOut.outTime.substr(0,10) == daydate[i]){
                                outarr.splice(i,i+1,objOut.outDeviceNum);
                            }
                        }
                    }
                    console.log("已卖出设备："+ outarr);
                    allarr = new Array(d);
                    allarr.fill(0);
                    for(var i = 0;i<daydate.length;i++){
                        for(var j = 0;j<optionData.deviceAllList.length;j++){
                            var objAll = optionData.deviceAllList[j];
                            if(objAll.inTime.substr(0,10) == daydate[i]){
                                allarr.splice(i,i+1,objAll.allDeviceNum);
                            }
                        }
                    }
                    console.log("所有设备："+ allarr);
                    onlinearr = new Array(d);
                    onlinearr.fill(0);
                    for(var i = 0;i<daydate;i++){
                        for(var j = 0;j<optionData.deviceOnlineList.length;j++){
                            var objOnline = optionData.deviceOnlineList[j]
                            if(objOnline.createTime.substr(0,10) == daydate[i]){
                                onlinearr.splice(i,i+1,objOnline.deviceOnlineCount);
                            }
                        }
                    }
                    console.log("在线设备："+ onlinearr);
                }
                initDeviceChat(daydate,ax,outarr,allarr,onlinearr)
                /*initDeviceChat(
                    optionData.deviceOutList,
					optionData.deviceAllList,
					optionData.deviceOnlineList);*/
            }
        })
    }
    //终端设备趋势
    function initDeviceChat(daydate,ax,outarr,allarr,onlinearr){
        var dom2 = document.getElementById("main2");
        var myChart2 = echarts.init(dom2);
        option2 = null;
        option2 = {
            tooltip: {
                trigger: 'axis'
            },
            legend: {
                data:['在线设备','已卖出量','设备总量']
            },
            grid: {
                left: '3%',
                right: '4%',
                bottom: '3%',
                containLabel: true
            },
            toolbox: {
                feature: {
                    dataView: {show: true, readOnly: false},
                    magicType: {show: true, type: ['line', 'bar']},
                    restore: {show: true},
                    saveAsImage: {show: true}
                }
            },

            xAxis: {
                type: 'category',
                boundaryGap: false,
                data: daydate,
                axisLabel:{
                    interval:ax,
                }
            },
            yAxis: {
                type: 'value'
            },
            series: [
                {
                    name:'在线设备',
                    type:'line',
                    data:onlinearr
                },
                {
                    name:'已卖出量',
                    type:'line',
                    data:outarr
                },
                {
                    name:'设备总量',
                    type:'line',
                    data:allarr
                }
            ]
        };
        if (option2 && typeof option2 === "object") {
            myChart2.setOption(option2, true);
        }
        window.onresize = function(){
            myChart2.resize();
        }
    }

    //用户状态
    function getUserCount(){
        $.ajax({
            type:"get",
            data:condition,
            url:"/user/userStatus",
            success:function(result){
                var optionData = result.data;
                initUserChat(optionData.onlineCount,optionData.offlineCount);
            }
        });
    }
    function initUserChat(onlineCount,offlineCount){
        var dom3 = document.getElementById("main3");
        var myChart = echarts.init(dom3);
        var app = {};
        option3 = null;
        option3 = {
            tooltip: {
                trigger: 'item',
                formatter: "{a} <br/>{b}: {c} ({d}%)"
            },
            legend: {
                orient: 'horizontal',
                x: 'top',
                data:['在线','离线']
            },
            series: [

                {
                    name:'用户情况',
                    type:'pie',
                    radius: ['40%', '55%'],
                    data:[
                        {value:onlineCount, name:'在线'},
                        {value:offlineCount, name:'离线'}
                    ]
                }
            ]
        };
        if (option3 && typeof option3 === "object") {
                var ser = option3.series;
                jQuery.each(ser,function(i,which){
                    jQuery.each(which.data,function(v,val){
                        if(val.value == 0){
                            which.data[v] = {};
                        }
                    })
                    myChart.setOption(option3, true);
                })
        }
        window.onresize = function() {
            myChart3.resize();
        }
    }


    function userCountLine(day){
        var dayNum = day.split("+");
        var d = dayNum[0];

        var dd = dayNum[1].split(",");
        var ax = parseInt(dayNum[2]);
        var daydate = [];
        daydate.push(dd)
        if(d !== ''){
            d = parseInt(d);
            daydate = daydate[0].reverse();
        }else{
            daydate = daydate[0]
        }
        $.ajax({
            type:"get",
            data: {"companyCode":(new parent.window._user()).getData('venderCode'), //厂商编号
                "productCode":(new parent.window._user()).getData('productCode'),  //产品名称编号
                "modelNumber":(new parent.window._user()).getData('versionCode'),//产品型号
                "_token":(new parent.window._user()).getData('token'),
                "day":day},
            url:"/user/getUserOnline",
            success:function(result){
                var optionData = result.data;
                var addarr;
                var totalarr;
                var activearr;
                if(d == ''){
                    addarr = new Array(24);
                    addarr.fill(0);
                    $.each(optionData.userCountList,function(index, item){
                        addarr.splice(index,index+1,item.userCount);
                    });
                    console.log("新增用户："+ addarr);
                    totalarr = new Array(24);
                    totalarr.fill(0);
                    $.each(optionData.userCountList,function(index, item){
                        totalarr.splice(index,index+1,item.userCount);
                    });
                    activearr = new Array(24);
                    activearr.fill(0);
                }else {
                    addarr = new Array(d);
                    addarr.fill(0);

                    for(var i = 0;i<daydate.length;i++){
                        for(var j = 0;j<optionData.userCountList.length;j++){
                            var objAdd = optionData.userCountList[j]
                            if(objAdd.createTime.substr(0,10) == daydate[i]){
                                addarr.splice(i,i+1,objAdd.userCount);
                            }
                        }
                    }
                    console.log("新增用户："+ addarr);
                    totalarr = new Array(d);
                    totalarr.fill(0);

                    for(var i = 0;i<daydate.length;i++){
                        for(var j = 0;j<optionData.userCountList.length;j++){
                            var objTotal = optionData.userCountList[j];
                            if(objTotal.createTime.substr(0,10) == daydate[i]){
                                totalarr.splice(i,i+1,objTotal.userCount);
                            }
                        }
                    }
                    activearr = new Array(d);
                    activearr.fill(0);
                }
                initUserChatLine(daydate,ax,addarr,activearr,totalarr);
            }
        });
    }

    function initUserChatLine(daydate,ax,addarr,activearr,totalarr){

        //用户手机趋势
        var dom4 = document.getElementById("main4");
        var myChart4 = echarts.init(dom4);
        var app = {};
        option4 = null;
        option4 = {
            tooltip: {
                trigger: 'axis'
            },
            legend: {
                data:['新增用户','活跃用户','用户总数']
            },
            grid: {
                left: '3%',
                right: '4%',
                bottom: '3%',
                containLabel: true
            },
            toolbox: {
                feature: {
                    dataView: {show: true, readOnly: false},
                    magicType: {show: true, type: ['line', 'bar']},
                    restore: {show: true},
                    saveAsImage: {show: true}
                }
            },
            xAxis: {
                type: 'category',
                boundaryGap: false,
                data: daydate,
                axisLabel:{
                    interval:ax,
                }
            },
            yAxis: {
                type: 'value'
            },
            series: [
                {
                    name:'新增用户',
                    type:'line',
                    data:addarr
                },
                {
                    name:'活跃用户',
                    type:'line',
                    data:activearr
                },
                {
                    name:'用户总数',
                    type:'line',
                    data:totalarr
                }
            ]
        };
        if (option4 && typeof option4 === "object") {
            myChart4.setOption(option4, true);
        }
        window.onresize = function() {
            myChart4.resize();
        }


    }

    //地区在线 总量
    function deviceCountByProvince(all,online,provinc) {
        var provinc = provinc.reverse();
        var dom5 = document.getElementById("main5");
        var myChart5 = echarts.init(dom5);
        var app = {};

        option5 = null;

        option5 = {
            tooltip : {
                trigger: 'axis',
                axisPointer : {            // 坐标轴指示器，坐标轴触发有效
                    type : 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
                }
            },
            legend: {
                data: ['在线','总量']
            },
            grid: {
                left: '3%',
                right: '4%',
                bottom: '3%',
                containLabel: true
            },
            xAxis:  {
                type: 'value',
                show:false
            },
            yAxis: {
                type: 'category',
                data: provinc
            },
            series: [
                {
                    name: '在线',
                    type: 'bar',
                    stack: '总量',
                    label: {
                        normal: {
                            show: true,
                            position: 'insideRight'
                        }
                    },
                    data: online
                },
                {
                    name: '总量',
                    type: 'bar',
                    stack: '总量',
                    label: {
                        normal: {
                            show: true,
                            position: 'insideRight'
                        }
                    },
                    data: all
                }
            ]
        };
        if (option5 && typeof option5 === "object") {
            var ser = option5.series;
            jQuery.each(ser,function(i,which){
                console.log(which.data)
                for(var d = 0;d < which.data.length;d++){
                    if(which.data[d] == 0){
                        which.data[d] = ''
                    }
                }
                myChart5.setOption(option5, true);
            })
        }
        window.onresize = function() {
            myChart5.resize();
        }
    }



    //地图
    var dommap = echarts.init(document.getElementById('mapAll'));
    var optionmap = {
        title : {
            text: '',
            subtext: '',
            x:'center'
        },
        tooltip : {//提示框组件。
            trigger: 'item'//数据项图形触发，主要在散点图，饼图等无类目轴的图表中使用。
        },
        legend: {
            orient: 'horizontal',//图例的排列方向
            x:'left',//图例的位置
            data:['订单量']
        },

        visualMap: {//颜色的设置  dataRange
            x: 'left',
            y: 'center',
            splitList: [
                {start: 1500},
                {start: 900, end: 1500},
                {start: 310, end: 1000},
                {start: 200, end: 300},
                {start: 10, end: 200, label: '10 到 200（自定义label）'},
                {start: 5, end: 5, label: '5（自定义特殊颜色）', color: 'black'},
                {end: 10}
            ],
//            min: 0,
//            max: 2500,
//            calculable : true,//颜色呈条状
            text:['高','低'],// 文本，默认为数值文本
            color: ['#E0022B', '#E09107', '#A3E00B']
        },
        toolbox: {//工具栏
            show: true,
            orient : 'vertical',//工具栏 icon 的布局朝向
            x: 'right',
            y: 'center',
            feature : {//各工具配置项。
                mark : {show: true},
                dataView : {show: true, readOnly: false},//数据视图工具，可以展现当前图表所用的数据，编辑后可以动态更新。
                restore : {show: true},//配置项还原。
                saveAsImage : {show: true}//保存为图片。
            }
        },
        roamController: {//控制地图的上下左右放大缩小 图上没有显示
            show: true,
            x: 'right',
            mapTypeControl: {
                'china': true
            }
        },
        series : [
            {
                name: '订单量',
                type: 'map',
                mapType: 'china',
                roam: false,//是否开启鼠标缩放和平移漫游
                itemStyle:{//地图区域的多边形 图形样式
                    normal:{//是图形在默认状态下的样式
                        label:{
                            show:true,//是否显示标签
                            textStyle: {
                                color: "rgb(249, 249, 249)"
                            }
                        }
                    },
                    emphasis:{//是图形在高亮状态下的样式,比如在鼠标悬浮或者图例联动高亮时
                        label:{show:true}
                    }
                },
                top:"3%",//组件距离容器的距离
                data:[
                    {name: '北京',value: Math.round(Math.random()*2000)},
                    {name: '天津',value: Math.round(Math.random()*2000)},
                    {name: '上海',value: Math.round(Math.random()*2000)},
                    {name: '重庆',value: Math.round(Math.random()*2000)},
                    {name: '河北',value: 0},
                    {name: '河南',value: Math.round(Math.random()*2000)},
                    {name: '云南',value: 5},
                    {name: '辽宁',value: 305},
                    {name: '黑龙江',value: Math.round(Math.random()*2000)},
                    {name: '湖南',value: 200},
                    {name: '安徽',value: Math.round(Math.random()*2000)},
                    {name: '山东',value: Math.round(Math.random()*2000)},
                    {name: '新疆',value: Math.round(Math.random()*2000)},
                    {name: '江苏',value: Math.round(Math.random()*2000)},
                    {name: '浙江',value: Math.round(Math.random()*2000)},
                    {name: '江西',value: Math.round(Math.random()*2000)},
                    {name: '湖北',value: Math.round(Math.random()*2000)},
                    {name: '广西',value: Math.round(Math.random()*2000)},
                    {name: '甘肃',value: Math.round(Math.random()*2000)},
                    {name: '山西',value: Math.round(Math.random()*2000)},
                    {name: '内蒙古',value: Math.round(Math.random()*2000)},
                    {name: '陕西',value: Math.round(Math.random()*2000)},
                    {name: '吉林',value: Math.round(Math.random()*2000)},
                    {name: '福建',value: Math.round(Math.random()*2000)},
                    {name: '贵州',value: Math.round(Math.random()*2000)},
                    {name: '广东',value: Math.round(Math.random()*2000)},
                    {name: '青海',value: Math.round(Math.random()*2000)},
                    {name: '西藏',value: Math.round(Math.random()*2000)},
                    {name: '四川',value: Math.round(Math.random()*2000)},
                    {name: '宁夏',value: Math.round(Math.random()*2000)},
                    {name: '海南',value: Math.round(Math.random()*2000)},
                    {name: '台湾',value: Math.round(Math.random()*2000)},
                    {name: '香港',value: Math.round(Math.random()*2000)},
                    {name: '澳门',value: Math.round(Math.random()*2000)}
                ]
            }
        ]
    };
    dommap.setOption(optionmap);
    dommap.on('mouseover', function (params) {
        var dataIndex = params.dataIndex;
        // console.log(params);
    });

    window.onresize = function(){
        dommap.resize();

    }
    function doUpload() {
        alert("dd");
        var formData = new FormData($("#uploadForm")[0]);
        // console.log(formData);
        $.ajax({
            url: '/product/uploadImage?_token='+token,
            type: 'POST',
            data: formData,
            async: false,
            cache: false,
            contentType: false,
            processData: false,
            success: function (returndata) {
                console.log(returndata);
                alert("成功了s");
                // document.getElementById("showpic").src="<%=basePath%>UploadImage?picture=showpic";/*这是预览图片用的，自己在文件上传表单外添加*/
            },
            error: function (returndata) {
                alert(returndata);
            }
        });
    }
</script>
</body>
</html>